<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style type="text/css">
#div1{position:absolute; left:0; top:0; width:200px; height:200px; background-color:red;}
#div2{position:absolute; left:250px; top:0; height:400px; background-color:blue; width:200px; display:none;}
</style>
</head>
<body>
<div id="div1"></div>
<div id="div2"></div>
<script src="myJS.js"></script>
<script>
var timer = null;
$("div1").onmouseover = $("div2").onmouseover = function (){
	clearTimeout(timer);
	$("div2").style.display = "block";
}
$("div1").onmouseout = $("div2").onmouseout = function (){
	timer = setTimeout(function (){
		$("div2").style.display = "none";
	},700)
}
</script>
</body>
</html>
